<template>
  <div class="tabbar" v-if="!route.meta.hiddenTabar">
  <van-tabbar v-model="currentIndex" route>
      <van-tabbar-item icon="home-o"  v-for="(item,index) in tabbarData"  :to="item.path">
        <span>{{ item.text }}</span>
        <template #icon>
            <img v-if="currentIndex==index" :src="item.imageActive" alt="">
            <img v-else :src="item.image" alt="">
    </template>
      </van-tabbar-item>
</van-tabbar>
   
  </div>
</template>

<script setup>
import tabbarData from '@/assets/data/tabbar';
import {ref} from 'vue'
import { useRoute } from 'vue-router';
const route=useRoute()

const currentIndex=ref(0)
// 

</script>

<style lang="less" scoped>
// 覆盖原来的样式
.tabbar{
    img{
      height: 30px;
    }
}

</style>